<!DOCTYPE html>
<html xmlns:v="urn:schemas-microsoft-com:vml">

	<head>
        <title>SmartArt</title>
        <style type="text/css">
            v\:polyline{behavior: url(#default#VML); display:inline-block;}
            
            .track {
				position : relative;
				width : 200px;
                height : 5px;
                margin-bottom: 25px;

			}
			.handle {
				height : 20px;
				width : 10px;
				z-index : 10;
				position : absolute;
                background : #808080;
                -webkit-box-shadow: 1px 1px 3px #888;
                -moz-box-shadow: 1px 1px 3px #888;
                border-radius: 3px;
            }
            .path {
                position: absolute;
                top: 6px;           
				width : 200px;
				height : 5px;
                border : 1px solid #bfbfbf;
            }
            #smartArt {
                position: relative;
                overflow: hidden;
                width: 500px;
                border: 1px solid #bfbfbf;
                padding: 50px;
                height: 230px;
                margin: 100px;
                overflow: visible;
            }
            #chart, #slider {
                float: left;
                
            }
            #slider {
                float: right;
            }
        </style>
    <script type="text/javascript" src="../jquery.js"></script>
    <script type="text/javascript" src="../slider/jQuery.slider.js"></script>
    <script type="text/javascript" src="smartArt.js"></script>
	</head>
    <body>
        <div id="smartArt">
        <div id="chart">
        </div>
		<div id='slider'>
            <input type="range"/>
            <input type="range"/>
            <input type="range"/>
            <input type="range"/>
            <input type="range"/>
        </div>
    </div>

    
	<script type="text/javascript">
        new SmartArt({
chart: '#chart',
sliders: '#slider input',
handleClass: 'handle',
trackClass: 'track',
pathClass: 'path'
        })
    </script>
	</body>
</html>

